<template>
	<view class="boxs " :class="[top ? 'margin-top' : '']">
		<view :class="{ 'solid-bottom': bottom }" class="flex bg-white  padding-sm justify-between" @click="OnClick()">
			<view class="margin-xs ">
				<text class="text-black margin-right" v-if="icon != ''" :class="['cuIcon-' + icon]"></text>
				<text class="text-size-28 text-black">{{ title }}</text>
				<text class="margin-left-sm text-gray text-size-28">{{ desc }}</text>
			</view>
			<view class="flex align-center">
				<text>{{ value }}</text>
				<text class="margin-xs cuIcon-right" v-if="after"></text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			count: 0
		};
	},
	name: 'cu-custom',
	computed: {
		style() {
			var style = '';
			return style;
		}
	},
	props: {
		title: {
			type: String,
			default: '标题'
		},
		desc: {
			type: String,
			default: ''
		},
		value: {
			type: String,
			default: ''
		},
		after: {
			type: [String, Boolean],
			default: true
		},
		top: {
			type: [String, Boolean],
			default: true
		},
		bottom: {
			type: [String, Boolean],
			default: true
		},
		icon: {
			type: String,
			default: ''
		},
		label: {
			type: String,
			default: ''
		}
	},
	created() {},
	methods: {
		OnClick() {
			this.$emit('onclick', this.label);
		}
	}
};
</script>

<style scoped>
.text-size-26 {
	line-height: 42upx;
}
</style>
